<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>添加用户</title>
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<link rel="stylesheet" href="../../css/oksub.css">
	<script type="text/javascript" src="../../lib/loading/okLoading.js"></script>
</head>
<body>
<div class="ok-body">
	<!--form表单-->
	<form class="layui-form layui-form-pane ok-form" lay-filter="form_body">
		<div class="layui-form-item">
			<label class="layui-form-label">手机号码</label>
			<div class="layui-input-inline">
				<input type="text" name="mobile" placeholder="请输入手机号码" autocomplete="off" class="layui-input"
				       lay-verify="phone">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">验证码</label>
			<div class="layui-input-inline">
				<input type="text" name="mobileCode" placeholder="请输入验证码" autocomplete="off" class="layui-input">
			</div>
			<div class="layui-input-inline">
				<button class="layui-btn" id="sendCode" lay-submit lay-filter="sendCode">获取验证码</button>
			</div>
		</div>
		<div class="layui-form-item">
			<div class="layui-input-block">
				<button class="layui-btn" lay-submit lay-filter="add">立即提交</button>
				<button type="reset" class="layui-btn layui-btn-primary">重置</button>
			</div>
		</div>
	</form>
</div>
<!--js逻辑-->
<script src="../../lib/layui/layui.js"></script>
<script>
	layui.use(["element", "form", "laydate", "okLayer", "okUtils"], function () {
		let element = layui.element;
		let form = layui.form;
		let laydate = layui.laydate;
		let okLayer = layui.okLayer;
		let okUtils = layui.okUtils;

		okLoading.close();

		form.on("submit(add)", function (data) {
			if (data.field.mobileCode == "") {
				okLayer.redCryMsg("请输入验证码！");
				return false;
			}

			layui.$.ajax({
				url:"/v1/cpdaily/user/add",
				type:"POST",
				data:JSON.stringify(data.field),
				dataType:"json",
				contentType:"application/json;charset=UTF-8",
				success:function(result){
					if (result.errCode == 0) {
						okLayer.greenTickMsg("添加成功！", function () {
							parent.layer.close(parent.layer.getFrameIndex(window.name));
						});

						// okLayer.greenTickMsg("获取验证码成功。", function () {
						// 	layui.$(data.elem).html(result.data.countdown + "秒");
						// 	layui.$(data.elem).addClass("layui-btn-disabled").attr("disabled",true);
						// 	waitTimer = setInterval(waitCode, 1000);
						// 	// parent.layer.close(parent.layer.getFrameIndex(window.name));
						// });
					} else {
						okLayer.redCryMsg(result.errMsg, function () {
							// parent.layer.close(parent.layer.getFrameIndex(window.name));
						});
					}
				}});

			// okUtils.ajax("/v1/cpdaily/user/add", "post", data.field, true).done(function (response) {
			// 	console.log(response);
			// 	okLayer.greenTickMsg("添加成功", function () {
			// 		parent.layer.close(parent.layer.getFrameIndex(window.name));
			// 	});
			// }).fail(function (error) {
			// 	console.log(error);
			// });
			return false;
		});

		form.on("submit(sendCode)", function (data) {
			if (data.field.moblie == "") {
				okLayer.redCryMsg("请输入手机号！");
				return false;
			}

			var mobile = {mobile:data.field.mobile};

			//console.log(data);

			layui.$.ajax({
				url:"/v1/cpdaily/mobile/sendCode",
				type:"POST",
				data:JSON.stringify(mobile),
				dataType:"json",
				contentType:"application/json;charset=UTF-8",
				success:function(result){
					if (result.errCode == 0) {

						if (result.data.tipMsg != "") {
							okLayer.greenTickMsg(result.data.tipMsg);
						} else {
							okLayer.greenTickMsg("获取验证码成功。");
						}

						layui.$(data.elem).html(result.data.countdown + "秒");
						layui.$(data.elem).addClass("layui-btn-disabled").attr("disabled",true);
						waitTimer = setInterval(waitCode, 1000);
					} else {
						okLayer.redCryMsg(result.errMsg, function () {
							// parent.layer.close(parent.layer.getFrameIndex(window.name));
						});
					}
				}});
			return false;
		});
	});

	var waitTimer = null;

	function waitCode () {
		var currentCount = parseInt(layui.$("#sendCode").html());

		if (currentCount == 0) {
			clearInterval(waitTimer);
			layui.$("#sendCode").html("获取验证码");
			layui.$("#sendCode").removeClass("layui-btn-disabled").attr("disabled",false);
		} else {
			layui.$("#sendCode").html((currentCount - 1) + "秒");
		}
	}
</script>
</body>
</html>
